import * as React from "react";
import { StyleSheet } from "react-native";
import { Button } from "react-native-elements";

interface Props extends React.Props<any>{
  title: string;
  didPressMeClosure: (content: string) => void;
}

interface State {}

export default class TagButton extends React.Component<Props, State> {
  constructor(props: Props) {
    super(props);
    this.state = {};
  }

  render() {
    return (
      <Button
        buttonStyle={styles.btnStyle}
        titleStyle={styles.titleStyle}
        title={this.props.title}
        onPressIn={() => this._clickBtn(this.props.title)}
      />
    );
  }

  _clickBtn = (content: string) => {
    this.props.didPressMeClosure(content);
  };
}

const styles = StyleSheet.create({
  btnStyle: {
    backgroundColor: "orange",
    borderRadius: 15,
    marginBottom: 12,
    marginLeft: 12,
    height: 30
  },
  titleStyle: {
    fontSize: 12
  }
});
